<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>用气列表</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../../plugins/mui/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="../../css/life_housekeeper/wate_index.css" />
		<script src="../../js/statistics.js"></script>
		<script src="../../js/fontset.js"></script>
		<style type="text/css">
			body{
				background: #fff;
			}
			.mui-content{
				background-color: #fff;
			}
			
		</style>
	</head>
	<body>
		<header class="mui-bar mui-bar-nav header">
		    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
		    <h1 class="mui-title">用气列表</h1>
		</header>
		<div class="mui-content">
			<div class="detail-list" id="detailList">
			</div>
		</div>
		<script src="../../plugins/mui/mui.min.js"></script>
		<script src="../../js/getApiToken.js"></script>
		<script src="../../js/md5.js"></script>
		<script src="../../js/life_housekeeper/windowTitleView.js"></script>
		<script src="../../plugins/template/template.js"></script>
		<script type="text/html" id="detailInfo">
			{{if row}}
			{{if row.length || Result.length}}
				{{if row.length}}
				{{each row as item j}}
				<div class="detail-list-item" data-options="{{item | objFormat}}">
					<div class="detail-list-box">
						<span class="detail-list-date">{{item.cwrq | monthFormat}}</span>
						<span class="detail-list-nub mui-pull-right">用气量：{{item.ql}}立方米</span>
					</div>
					<div class="detail-list-box">
						<span class="detail-list-money">缴费金额：{{item.qfje}}元</span>
						<span class="detail-list-state state-no_pay mui-pull-right">未缴费</span>
					</div>
				</div>
				{{/each}}
				{{/if}}
				{{if Result.length}}
				{{each Result as info i}}
				<div class="detail-list-item" data-options="{{info | objFormat}}">
					<div class="detail-list-box">
						<span class="detail-list-date">{{info.cwrq | monthFormat}}</span>
						<span class="detail-list-nub mui-pull-right">用气量：{{info.ql}}立方米</span>
					</div>
					<div class="detail-list-box">
						<span class="detail-list-money">缴费金额：{{info.qfje}}元</span>
						<span class="detail-list-state state-pay mui-pull-right">已缴费</span>
					</div>
				</div>
				{{/each}}
				{{/if}}
			{{else}}
			<div class="error-message mui-text-center">暂无信息</div>
			{{/if}}
			{{else}}
			<div class="error-message mui-text-center">暂无信息</div>
			{{/if}}
		</script>
		<script type="text/javascript">
			mui.init();
			var detailList = document.getElementById("detailList");
			template.helper('objFormat',function(obj){
				if(obj){
					var a = JSON.stringify(obj);
					return a;
				}	
			});
			template.helper('monthFormat',function(month){
				if(month){
					var b1=month.substring(0,4);
					var b2=month.substring(4,6);
					var c=b1+'-'+b2;
					return c;
				}	
			});
			mui.plusReady(function(){
				var _self =plus.webview.currentWebview(),
					code =  _self.code,
					user = _self.user,
					row = _self.row;
					console.log(code);
					console.log('detail'+JSON.stringify(row));
					plus.nativeUI.showWaiting();			
				var data = {
					yhbh:code
				};
				myAjax('home/gas/getCharge','post',data,function(result){
					//console.log(result);
					plus.nativeUI.closeWaiting();
					if(result.code == 0){
						var res = result.data;
							res.row = row;
							//console.log(JSON.stringify(res));
						var detailHtml = template('detailInfo',res);
							detailList.innerHTML = detailHtml;
						mui('.detail-list').on('tap','.detail-list-item',function(e){
							var _this = this,
								options = _this.getAttribute('data-options');
							if(!options){
								return;
							}
							options = JSON.parse(options);
							var viewOptions = {
								url:'gas_detail-info.html',
								id:'gas_detail-info'
							},
							extras ={
								detailInfo:options,
								user:user
							},
							titleOptions = {
								backImg:'whiteBack'
							};
							addTitleView(viewOptions,extras,titleOptions);	
						})	
							
					}else{
						mui.toast('查询失败，请稍后再试');
					}
						
				})	
			})
		</script>
	</body>
</html>
